<template>
	<div class="Index">
		<router-link to="/">最新榜单</router-link>
		<router-link to="/hotList">热量榜单</router-link>

		<transition name="list" mode="out-in">
			<router-view></router-view>
		</transition>

		<h3 @click="$router.push('/issue')">点我跳转到发布页</h3>
	</div>
</template>

<script>
</script>

<style lang="scss" scoped>
	.list-leave-to {
		transform: translateX(100%) rotateX(180deg);
	}

	.list-leave-active {
		transition: all .5s;
	}

	.list-enter {
		transform: translateX(100%);
	}

	.list-enter-active {
		transition: all .5s;
	}
</style>
